<template>
  <div>
    <el-tree
      :data="treeList"
      :props="defaultProps"
      :expand-on-click-node="false"
      accordion
      ref="tree"
      node-key="id"
      :highlight-current="true"
      @node-click="handleNodeClick"
      :filter-node-method="filterNode"
      :default-expanded-keys="[branchinnercode]"
      v-loading="loading"
      style="max-height: 600px;overflow: auto"
    />
  </div>
</template>

<script>
  import request from '@/utils/request';

  export default {
    name: "index",
    data() {
      return {
        treeList: [],
        defaultProps: {
          children: "children",
          label: "label"
        },
        loading: true,
        branchinnercode: null,
      }
    },
    created() {
      this.getTreeList();
    },
    methods: {
      //获取树结构数据
      getTreeList() {
        this.loading = true;
        request({
          url: '/config/customs/treeData',
          method: 'post',
        }).then(res => {
          this.treeList = res.data;
          this.branchinnercode = this.selectChildren(res.data[0]).id;
          this.$nextTick(() => {
            this.$refs.tree.setCurrentKey(this.branchinnercode);
          })
          this.$emit('closeDialog', this.selectChildren(res.data[0]));
          this.loading = false;
        }).catch(err => {
          this.$message.error('模块树数据获取失败！');
          this.loading = false;
        })
      },
      handleNodeClick(node) {
        this.$emit('closeDialog', node);
      },
      //获取树结构第一条数据
      selectChildren(data) {
        if (data.children != undefined) {
          return this.selectChildren(data.children[0]);
        } else {
          return data;
        }
      },
      // 筛选节点
      filterNode(value, data) {
        if (!value) return true;
        return data.label.indexOf(value) !== -1;
      },
    },
  }
</script>

<style scoped>

</style>
